<template>
  <div>
    <FormItem required :label="t('模板编号：')">
      <a-input v-model:value="processInfo.code" :placeholder="t('请填写模板编号')" />
    </FormItem>
    <FormItem required :label="t('模板名称：')">
      <a-input v-model:value="processInfo.name" :placeholder="t('请填写模板名称')" />
    </FormItem>
    <FormItem required :label="t('模板分类：')">
      <a-select
        v-model:value="processInfo.category"
        :placeholder="t('请选择模板分类')"
        style="width: 100%"
      >
        <a-select-option v-for="item in categoryOptions" :key="item.id" :value="item.id">
          {{ item.name }}
        </a-select-option>
      </a-select>
    </FormItem>
    <FormItem :label="t('命名规则：')">
      <NameRuleModel
        v-model="processInfo.nameRule"
        v-model:nameRuleConfigs="processInfo.nameRuleConfigs"
      />
    </FormItem>

    <ApproveRules
      v-model:autoAgreeRule="processInfo.autoAgreeRule"
      v-model:noHandler="processInfo.noHandler"
      v-model:isPrevChooseNext="processInfo.isPrevChooseNext"
    />
    <FormItem :tip="t('配置默认表单后，用户任务节点均会包含该表单')" :label="t('默认表单：')">
      <SettingDefaultForm />
    </FormItem>
    <!-- <FormItem :label="t('移动端：')">
      <a-switch v-model:checked="processInfo.appShow" />
    </FormItem> -->
    <FormItem :label="t('备注：')">
      <a-textarea v-model:value="processInfo.remark" :rows="8" />
    </FormItem>
  </div>
</template>

<script setup lang="ts" name="ProcessBasic">
  import { storeToRefs } from 'pinia';
  import { ref } from 'vue';
  import { useBpmnStore } from '/@bpmn/store/bpmn';
  import FormItem from '/@bpmn/layout/FormItem.vue';
  import ApproveRules from '/@bpmn/components/ApproveRules.vue';
  import NameRuleModel from './NameRule.vue';
  import SettingDefaultForm from './SettingDefaultForm.vue';
  import { TreeItem } from '/@/components/Tree';
  import { getDicDetailList } from '/@/api/system/dic';
  import { FlowCategory } from '/@/enums/workflowEnum';
  import { useI18n } from '/@/hooks/web/useI18n';
  const { t } = useI18n();

  const store = useBpmnStore();
  const { processInfo } = storeToRefs(store);
  // 模板分类
  const categoryOptions = ref<TreeItem[]>([]);
  getCategoryList();
  async function getCategoryList() {
    categoryOptions.value = (await getDicDetailList({
      itemId: FlowCategory.ID,
    })) as unknown as TreeItem[];
  }
</script>

<style lang="less" scoped></style>
